<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>用户充值</title>
	<<link rel="stylesheet" type="text/css" href="Resources/css/amazeui.min.css" />
	<link rel="stylesheet" type="text/css" href="Resources/css/recharge.css" />
</head>
<body>
	<div class="pay">
		<!--主内容开始编辑-->
		<div class="tr_recharge">
			<div class="tr_rechtext">
				<p class="te_retit"><img src="Resources/images/recharge_img/coin.png" alt="" />充值中心</p>
				<p>宠物商店充值中心</p>
			</div>
			<form action="listUser?status=userrecharge&uid=${user.uid }" class="am-form" id="doc-vld-msg" method="post">
				<div class="tr_rechbox">
					<div class="tr_rechhead">
						<img src="Resources/images/recharge_img/ys_head2.jpg" />
						<p>充值帐号：
							<a>${user.uname }</a>
						</p>
						<div class="tr_rechheadcion">
							<img src="Resources/images/recharge_img/coin.png" alt="" />
							<!--当前余额显示-->
							<span>当前余额：￥<span>${user.balance }</span></span>
						</div>
					</div>
					<div class="tr_rechli am-form-group">
						<label>充值金额:</label>
						<label class="am-radio">
							<input type="number" min="10" max="10000" name="balance" value="10.00元" class="othbox" data-validation-message="充值金额范围：10-10000元" style="width: 380px;"/>
						</label>
					</div>
					<br>
					<div class="tr_rechcho am-form-group">
						<span>充值方式：</span>
						<label class="am-radio">
								<input type="radio" name="radio1" value="" data-am-ucheck required data-validation-message="请选择一种充值方式"><img src="Resources/images/recharge_img/wechatpay.png">
							</label>
						<label class="am-radio" style="margin-right:30px;">
								<input type="radio" name="radio1" value="" data-am-ucheck data-validation-message="请选择一种充值方式"><img src="Resources/images/recharge_img/zfbpay.png">
						</label>
					</div>
				</div>
				<div class="tr_paybox">
					<input type="submit" value="确认支付" class="tr_pay am-btn" />
					<span>温馨提示：如遇到bug请拨打联系电话。</span>
				</div>
			</form>
		</div>
	</div>
	<script type="text/javascript" src="Resources/js/jquery.min.js"></script>
	<script type="text/javascript" src="Resources/js/amazeui.min.js"></script>
	<script type="text/javascript" src="Resources/js/ui-choose.js"></script>
	<script type="text/javascript">
		$(function() {
			$('#doc-vld-msg').validator({
				onValid: function(validity) {
					$(validity.field).closest('.am-form-group').find('.am-alert').hide();
				},
				onInValid: function(validity) {
					var $field = $(validity.field);
					var $group = $field.closest('.am-form-group');
					var $alert = $group.find('.am-alert');
					// 使用自定义的提示信息 或 插件内置的提示信息
					var msg = $field.data('validationMessage') || this.getValidationMessage(validity);
	
					if(!$alert.length) {
						$alert = $('<div class="am-alert am-alert-danger"></div>').hide().
						appendTo($group);
					}
					$alert.html(msg).show();
				}
			});
		});
	</script>
</body>
</html>